<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <style>
    #t1{
      color: green;
    }

    .t2{
      color: yellow;
    }
   .t3,input[type="text"]{background-color: red}
     .t3{
      background-color: red;


    }
    #t4{
       color: pink;
     }
    body>div>div>p{
      background-color: yellow;
    }

    a:link{
      color: green;
    }

    a:visited{
      color: red;
    }

    a:hover{
      color: yellow;
    }

    a:active{
      color: pink;
    }





  </style>
</head>
<body>
<ul>
  <li>刘备</li><li id="t1">关羽</li>
  <li class="t2">张飞</li>
</ul>

<p class="t3">香蕉</p>
<p class="t2 t3">苹果</p>

<input type="text" placeholder="用户名" class="t3">
<input type="password" placeholder="密码">

<div>
  <p>p1</p>
  <div><p id="t4">p2</p></div>
  <div><p>p3</p></div>
</div>
<a href="http://www.tedu.cn" target="_blank">达内官网</a>
</body>
</html>